<template>
	<view class="item p30 bgf  r20 mt20" @click="$go('/pages/workerClient/order/detail?id='+data.id)">
		<view class="title t-flex between pb30">
			<view class="c3">
				订单号：{{data.order_sn}}
			</view>
			<view class="mainC">
				待接单
			</view>
		</view>
		<view class="t-flex between mt20">
			<view class="c6">
				车辆信息：
			</view>
			<view class="c3">
				{{data.car_type_name}}/{{data.car_dl_name}} <text class="tag ml10">{{data.car_pre==1?'师傅备车':'用户自备'}}</text>
			</view>
		</view>
		<view class="t-flex between mt20">
			<view class="c6">
				上门地点：
			</view>
			<view class="c3">
				{{data.address}}
			</view>
		</view>
		<view class="actions t-flex between">
			<view class="f24 c9">
				{{$time(data.createtime,5)}}
			</view>	
			<view class="btns mt30 t-flex">
				<view class="btn t-flex center">查看详情</view>
				<view class="btn t-flex center s2"
				@click.stop="emit('take',data)"
				>接单</view>
			</view>
				
		</view>
	
	
	</view>
</template>

<script setup lang="ts">
	
	const emit = defineEmits(['take'])
	defineProps({
		data:{
			type:Object,
			default:{}
		}
	})
	
	
</script>

<style scoped lang="scss">
	.item{
		.title{
			border-bottom: 2rpx solid #f5f5f5;
		}
		.tag{
			font-size: 20rpx;
			color: #FFA000;
			background: rgba(255,160,0,0.14);
			border-radius: 8rpx;
			padding: 4rpx 14rpx;
		}
		.btn{
			width: 160rpx;
			height: 68rpx;
			background: #FFFFFF;
			border-radius: 35rpx;
			border: 2rpx solid #EEEEEE;
			color: #666;
		}
		.btn.s2{
			background-color: $main-color;
			border-color: $main-color;
			color: #fff;
			margin-left: 24rpx;
		}
	}

</style>